<template>
  <div>
    <div class="login-status">
      <div>
        <p>VIP1</p><i>会员等级</i>
      </div>
      <div class="icon">
        <img src="../../../static/imgs/login-icon.png" alt="">
      </div>
      <div>
        <p>0</p><i>伊豆</i>
      </div>
    </div>
    <div class="phone">{{getNumb}}</div>
  </div>
</template>
<script>

  export default {
    computed:{
        getNumb:function(){
            return this.$store.state.numb;
        }
    }
  }
</script>
<style scoped>
  .login-status{
    width: 1.92rem;
    margin: 0 auto;
    font-size: 0;
  }
  .login-status div{
    width: .64rem;
    height: .64rem;
    /*border:1px solid black;*/
    text-align: center;
    display: inline-block;
    vertical-align: middle;
  }
  .login-status div p{
    width: .38rem;
    height: .18rem;
    background: #ffc600;
    border-radius: .1rem;
    line-height: .18rem;
    text-align: center;
    color: white;
    margin: .12rem .12rem .1rem .12rem;
    font-size: .12rem;
  }
  .login-status div i{
    font-style: normal;
    color: white;
    font-size: .12rem;
  }

  .login-status .icon img{
    width: 100%;
    height:100%;
  }
  .phone{
    height: .45rem;
    text-align: center;
    line-height: .45rem;
    color: #ffc600;
    font-size: .17rem;
  }
</style>
